@import '@/css/fn.scss';
.user{
  height: pxToRpx(120px);
  background: linear-gradient(#4cb8c4 0%, #3cd3ad 100%);
  border-radius: 0 0 pxToRpx(20px) pxToRpx(20px);
  .no_user{
    width: 100%;
    height: 100%;
    grid-template-columns: pxToRpx(72px) auto;
    column-gap: pxToRpx(8px);
    align-items: center;
    .image_wrapper{
      border: pxToRpx(1px) solid #C4C4C4;
      height: pxToRpx(72px);
      background: #fbfcff;
    }
    .image{
      min-width: pxToRpx(36px);
      max-width: pxToRpx(36px);
      width: pxToRpx(36px);
      min-height: pxToRpx(36px);
      max-height: pxToRpx(36px);
      height: pxToRpx(36px);
    }
  }
  .userinfo{
    width: 100%;
    height: 100%;
    grid-template-columns: pxToRpx(72px) auto;
    column-gap: pxToRpx(8px);
    align-items: center;
    .name{
      width: 100%;
      box-sizing: border-box;
      padding-right: 20px;
      display: flex;
      align-items: center;
      line-height: 40px;
    }
    .image{
      min-width: pxToRpx(72px);
      max-width: pxToRpx(72px);
      width: pxToRpx(72px);
      min-height: pxToRpx(72px);
      max-height: pxToRpx(72px);
      height: pxToRpx(72px);
    }
    .edit {
      width: 28px;
      height: 28px;
      padding-bottom: 0;
    }
    .user_name{
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      box-sizing: border-box;
      padding-right: 20px;
    }
  }
}